<route lang="json5"></route>

<script setup lang="ts">
import ViewContainer from "@/layouts/ViewContainer.vue";
import titleConfig from "./shipment.title";
import Form from "@/components/StorageForm/index";
import { storageService } from "@/service/storage";
import Spin from "@/components/Spin/index.vue";
import { useToastStore } from "@/store";

const Basic = Form.BasicForm;
const Row = Form.CommonRow;
const List = Form.ListForm;

const toastStore = useToastStore();

const loading = ref(false);

const currentId = ref();

const scanList = ref([]);
const basicInfo = reactive({
	carrier: null,
	name: null,
	phone: null,
	trainNumber: null,
	transportStatus: null,
	seal: null,
	purchaseOrder: null,
	trailer: null,

	// 已出货数
	deliverPackageQuantity: null,
	// 未出货数
	unDeliverPackageQuantity: null,
});

const init = async (id) => {
	loading.value = true;
	currentId.value = id;
	try {
		const rs = await storageService.getCardDetail(id);
		if (rs) {
			console.log(rs);
			let deliverPackageQuantity = 0;
			let inPackageQuantity = 0;

			scanList.value = rs.logisticsDetailList.map((item) => {
				deliverPackageQuantity += item.deliverPackageQuantity;
				inPackageQuantity += item.inPackageQuantity;

				return {
					id: item.id,
					mainOrderNumber: item.mainOrderNumber,
					outPackageQuantity: item.outPackageQuantity ?? 0,
					inPackageQuantity: item.inPackageQuantity ?? 0,
					deliverPackageQuantity:
						(item.inPackageQuantity ?? 0) - (item.deliverPackageQuantity ?? 0),
					alldeliverPackageQuantity:
						(item.inPackageQuantity ?? 0) - (item.deliverPackageQuantity ?? 0),
					weight: item.weight,
					transportationRoute: item.transportationRoute,
					trap: item.palletQuantity ?? 0,
				};
			});
			basicInfo.carrier = rs.carrier;
			basicInfo.name = rs.name;
			basicInfo.phone = rs.phone;
			basicInfo.trainNumber = rs.trainNumber;
			basicInfo.transportStatus = rs.transportStatus;
			basicInfo.seal = rs.seal;
			basicInfo.purchaseOrder = rs.purchaseOrder;
			basicInfo.trailer = rs.trailer;

			basicInfo.deliverPackageQuantity = deliverPackageQuantity;
			basicInfo.unDeliverPackageQuantity =
				inPackageQuantity - deliverPackageQuantity;
			return;
		}
	} catch (error) {
		console.log(error);
	} finally {
		loading.value = false;
	}
};

const totalConfig = computed(() => {
	const _d = scanList.value;

	const total = _d.length;
	let totalInPackageQuantity = 0;
	let totalWeight = 0;
	let totalTrapNumber = 0;

	_d.forEach((item) => {
		totalInPackageQuantity += item.inPackageQuantity;
		totalWeight += item.weight;
		totalTrapNumber += item.trap ?? 0;
	});

	return [
		{
			label: "总计:",
			value: total,
		},
		{
			label: "总入库数:",
			value: totalInPackageQuantity,
		},
		{
			label: "总重:",
			value: totalWeight,
		},
		{
			label: "总托盘数:",
			value: totalTrapNumber,
		},
		{
			label: "已出货数:",
			value: basicInfo.deliverPackageQuantity,
		},
		{
			label: "未出货数:",
			value: basicInfo.unDeliverPackageQuantity,
		},
	];
});

// 货物信息配置
const tailConfig = [
	{
		label: "主单号",
		key: "mainOrderNumber",
	},
	{
		label: "入库数量",
		key: "inPackageQuantity",
	},
	{
		label: "出货数量",
		key: "deliverPackageQuantity",
		type: "inputNumber",
	},
	{
		label: "重量",
		key: "weight",
	},
	{
		label: "运输路线",
		key: "transportationRoute",
	},
	{
		label: "托盘",
		key: "trap",
	},
];

// 返回
const handleBack = () => {
	uni.navigateBack();
};

// 出货
const handleConfirm = async () => {
	loading.value = true;
	try {
		const detailList = scanList.value.map((item) => ({
			id: item.id,
			deliverPackageQuantity: item.deliverPackageQuantity,
		}));

		const params = {
			id: currentId.value,
			detailList,
		};
		const rs = await storageService.deliveryPackage(params);
		if (rs) {
			// message.alert("入库成功");
			toastStore.set("出货成功", "success");

			setTimeout(() => {
				uni.reLaunch({ url: "/pages/index/index" });
			}, 2000);
		}
	} catch (error) {
		console.log(error);
	} finally {
		loading.value = false;
	}
};

onLoad((options) => {
	if (options.id) {
		init(options.id);
	} else {
		toastStore.set("暂无出货扫描信息,请重新扫描", "warning");
	}
});

onUnload(() => {
	scanList.value = [];
});
</script>

<template>
	<ViewContainer :title="titleConfig" innerClass="logistics-detail-page">
		<Spin :loading="loading" full>
			<Basic :showTitle="true" type="show" :data="basicInfo" :simple="false" />
			<Row :config="totalConfig" class="mt" />

			<!-- <template v-for="item in scanConfig" :key="item.label">
				<Row :config="item" class="mt" title="货物信息" />
			</template> -->

			<List
				title="货物信息"
				v-model:value="scanList"
				:config="tailConfig"
				class="mt"
				:cusUiConfig="{ labelSpan: 8, valueSpan: 16 }"
			/>

			<view class="btn-group">
				<wd-button
					@click="handleBack"
					class="btn back"
					type="info"
					:round="false"
					>返回</wd-button
				>
				<wd-button @click="handleConfirm" class="btn confirm" :round="false"
					>确认出货</wd-button
				>
			</view>
		</Spin>
	</ViewContainer>
</template>

<style lang="less">
:deep(.logistics-detail-page) {
	.mt {
		margin-top: 30px;
	}

	.btn-group {
		display: flex;
		justify-content: center;
		margin: 50px 0;

		.btn {
			width: 45%;
			height: 100px;
		}
	}
}
</style>
